<template>
    <div>
        <el-card @click="goDetail" shadow="hover" :body-style="{ padding: '20px' }">
            <div slot="header" class="content">
                <div class="left">
                    <div class="name">
                        {{ hospital.hosname }}
                    </div>
                    <div class="desc">
                        <div class="level">
                            <svg t="1732780950064" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                xmlns="http://www.w3.org/2000/svg" p-id="4283" width="16" height="16">
                                <path
                                    d="M939.358251 423.424662c-23.01825-37.252439-62.924121-60.779272-107.019409-63.209624-2.755764-0.38681-5.510504-0.579191-8.347109-0.579191l-152.202471-0.121773c6.649444-28.975938 10.015098-58.653865 10.015098-88.657202 0-28.223808-3.213181-57.139372-9.556657-85.952604-0.447185-2.043542-1.098008-4.006244-1.932002-5.866614-15.820314-57.302077-67.37755-96.841605-127.282918-96.841605-72.827679 0-132.081201 59.254545-132.081201 132.081201 0 3.334955 0.132006 6.66991 0.406253 10.015098-2.196015 57.211003-32.108279 109.947088-80.269162 141.363611-14.447037 9.42465-18.524912 28.773324-9.099239 43.220361 9.414417 14.437827 28.752858 18.535145 43.220361 9.099239 65.811892-42.925648 106.429984-115.325585 108.656699-193.684234 0.030699-1.332345-0.010233-2.663666-0.14224-3.996011-0.203638-2.012843-0.304945-4.016477-0.304945-6.019087 0-38.381146 31.233352-69.614497 69.614497-69.614497 32.57593 0 60.474326 22.204721 67.824735 53.997821 0.356111 1.534959 0.823761 3.019777 1.402953 4.453429 4.696975 22.814612 7.076162 45.579081 7.076162 67.743894 0 37.485753-6.222725 74.352405-18.494213 109.592001-3.324722 9.546424-1.819438 20.111037 4.02671 28.345582 5.856381 8.245801 15.332197 13.146415 25.448602 13.156648l193.226816 0.101307c1.423419 0.264013 2.857071 0.426719 4.300956 0.477884 24.116257 0.9967 45.935192 13.614066 58.603723 34.090423 7.838525 12.31242 11.438517 26.800389 10.431583 41.939181-0.080841 0.945535-0.121773 1.911536-0.11154 2.877537 0 0.854461 0.040932 1.697665 0.11154 2.53166 0.010233 0.335644-0.030699 0.661056-0.11154 0.976234-0.101307 0.376577-0.193405 0.772596-0.284479 1.159406l-74.972529 330.391802c-0.914836 1.281179-1.738597 2.6432-2.449795 4.046153-5.937223 11.762905-14.660908 21.48329-25.346271 28.172643-10.746762 6.812149-23.059182 10.614755-35.757388 11.06194-0.854461-0.061398-513.766226-0.224104-513.766226-0.224104-0.467651-0.020466-0.935302-0.030699-1.402953-0.030699 0 0-111.01542 0.172939-112.718201 0.457418-1.932002 0-3.446495-1.50426-3.446495-3.415796l0.299829-416.334173c0-1.901303 1.545192-3.446495 3.01466-3.456728l1.245364 0.121773c1.174756 0.132006 2.653433 0.284479 3.52836 0.193405l83.82822-0.222057 0 339.367221c0 17.253966 13.979386 31.233352 31.233352 31.233352s31.233352-13.979386 31.233352-31.233352L281.009092 435.350273c0-1.778506 0-8.631588 0-10.411117 0-17.253966-13.979386-30.928407-31.233352-30.928407-1.50426 0-117.547183 0.304945-119.402437 0.304945-36.34272 0-65.913199 29.566386-65.913199 65.893756l-0.299829 416.334173c0 36.337603 29.571503 65.902966 65.913199 65.902966 2.541893 0 111.406323-0.457418 111.406323-0.457418 0.457418 0.020466 0.925069 0.030699 1.382487 0.030699 0 0 511.458671 0.274246 512.505513 0.274246 25.469068 0 50.296523-7.197936 71.647807-20.73116 19.612687-12.281721 35.777855-29.881564 46.839795-50.967812 3.660366-5.622044 6.435573-11.875468 8.256034-18.615986 0.11154-0.416486 0.213871-0.823761 0.304945-1.240247l74.881454-330.340637c1.596358-6.212492 2.257413-12.586666 2.00261-18.992563C960.892707 473.366098 953.948551 446.331371 939.358251 423.424662z"
                                    fill="#999999" p-id="4284"></path>
                                <path
                                    d="M450.027553 518.650467c-17.253966 0-31.233352 13.979386-31.233352 31.233352l0 30.470989c0 17.253966 13.979386 31.233352 31.233352 31.233352 17.253966 0 31.233352-13.979386 31.233352-31.233352l0-30.470989C481.260905 532.629853 467.281519 518.650467 450.027553 518.650467z"
                                    fill="#999999" p-id="4285"></path>
                                <path
                                    d="M693.805696 518.650467c-17.253966 0-31.233352 13.979386-31.233352 31.233352l0 30.470989c0 17.253966 13.979386 31.233352 31.233352 31.233352 17.253966 0 31.233352-13.979386 31.233352-31.233352l0-30.470989C725.039048 532.629853 711.058638 518.650467 693.805696 518.650467z"
                                    fill="#999999" p-id="4286"></path>
                                <path
                                    d="M648.940882 660.09492c-14.304797-9.393951-33.592073-5.398964-43.159986 8.763594-0.132006 0.193405-13.614066 19.754926-34.171264 19.754926-19.98824 0-32.423457-18.09717-33.266661-19.368116-9.17087-14.427594-28.254507-18.809391-42.834574-9.770528-14.650675 9.109472-19.155269 28.366048-10.055007 43.016723 11.214413 18.047028 41.96988 48.588625 86.156242 48.588625 43.962258 0 75.104535-30.318516 86.572728-48.222281C667.404396 688.461991 663.216004 669.500127 648.940882 660.09492z"
                                    fill="#999999" p-id="4287"></path>
                            </svg>
                            <span>{{ hospital.param.hostypeString }}</span>
                        </div>
                        <div class="time">
                            <svg t="1732781096079" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                xmlns="http://www.w3.org/2000/svg" p-id="5491" width="16" height="16">
                                <path
                                    d="M512 898.612245c-198.530612 0-360.489796-161.959184-360.489796-360.489796s161.959184-360.489796 360.489796-360.489796 360.489796 161.959184 360.489796 360.489796-161.959184 360.489796-360.489796 360.489796z m0-679.183674c-175.542857 0-318.693878 143.15102-318.693878 318.693878s143.15102 318.693878 318.693878 318.693878 318.693878-143.15102 318.693878-318.693878-143.15102-318.693878-318.693878-318.693878z"
                                    fill="#333333" p-id="5492"></path>
                                <path
                                    d="M872.489796 306.677551c-13.583673 0-27.167347-5.22449-37.093878-15.15102l-102.4-102.4a51.774694 51.774694 0 0 1-14.106122-47.542858c3.657143-16.718367 15.15102-30.82449 30.82449-37.616326 49.110204-19.853061 105.012245-8.881633 142.106122 28.734694 37.616327 37.616327 48.587755 92.995918 28.734694 142.106122-6.269388 15.673469-20.37551 27.167347-37.616326 30.82449-3.657143 0.522449-6.791837 1.044898-10.44898 1.044898zM798.82449 135.836735c-11.493878 0-22.987755 2.089796-33.959184 6.791836-4.179592 1.567347-5.22449 5.22449-5.746939 6.791837-0.522449 1.567347-0.522449 6.269388 3.134694 9.926531l102.4 102.4c3.657143 3.657143 7.836735 3.134694 9.926531 3.134694 2.089796-0.522449 5.22449-1.567347 6.791837-5.746939 13.583673-33.436735 5.746939-71.57551-19.330613-96.653061-17.240816-17.763265-39.706122-26.644898-63.216326-26.644898z"
                                    fill="#333333" p-id="5493"></path>
                                <path
                                    d="M151.510204 306.677551c-3.657143 0-6.791837-0.522449-10.44898-1.044898-16.718367-3.657143-30.82449-15.15102-37.616326-30.82449-19.853061-49.110204-8.881633-105.012245 28.734694-142.106122 37.616327-37.616327 92.995918-48.587755 142.106122-28.734694 15.673469 6.269388 27.167347 20.37551 30.82449 37.616326 3.657143 17.240816-2.089796 35.004082-14.106122 47.542858L188.604082 291.004082c-9.926531 9.926531-22.987755 15.673469-37.093878 15.673469zM225.17551 135.836735c-22.987755 0-45.97551 8.881633-63.216326 26.122449-25.6 25.6-32.914286 63.738776-19.330613 96.653061 1.567347 4.179592 5.22449 5.22449 6.791837 5.746939 1.567347 0.522449 6.269388 0.522449 9.926531-3.134694l102.4-102.4c3.657143-3.657143 3.134694-7.836735 3.134694-9.926531-0.522449-2.089796-1.567347-5.22449-5.746939-6.791837-11.493878-4.179592-22.465306-6.269388-33.959184-6.269387z"
                                    fill="#333333" p-id="5494"></path>
                                <path
                                    d="M514.612245 559.020408c-11.493878 0-20.897959-9.404082-20.897959-20.897959V303.020408c0-11.493878 9.404082-20.897959 20.897959-20.897959s20.897959 9.404082 20.897959 20.897959v235.102041c0 11.493878-9.404082 20.897959-20.897959 20.897959z"
                                    fill="#333333" p-id="5495"></path>
                                <path
                                    d="M514.612245 559.020408h-182.857143c-11.493878 0-20.897959-9.404082-20.897959-20.897959s9.404082-20.897959 20.897959-20.897959h182.857143c11.493878 0 20.897959 9.404082 20.897959 20.897959s-9.404082 20.897959-20.897959 20.897959z"
                                    fill="#333333" p-id="5496"></path>
                                <path
                                    d="M172.408163 898.612245c-5.22449 0-10.44898-2.089796-14.628571-6.269388-8.359184-8.359184-8.359184-21.420408 0-29.779592l94.040816-94.040816c8.359184-8.359184 21.420408-8.359184 29.779592 0 8.359184 8.359184 8.359184 21.420408 0 29.779592l-94.040816 94.040816c-4.702041 4.179592-9.926531 6.269388-15.151021 6.269388z"
                                    fill="#333333" p-id="5497"></path>
                                <path
                                    d="M851.591837 898.612245c-5.22449 0-10.44898-2.089796-14.628572-6.269388l-94.040816-94.040816c-8.359184-8.359184-8.359184-21.420408 0-29.779592 8.359184-8.359184 21.420408-8.359184 29.779592 0l94.040816 94.040816c8.359184 8.359184 8.359184 21.420408 0 29.779592-4.702041 4.179592-9.926531 6.269388-15.15102 6.269388z"
                                    fill="#333333" p-id="5498"></path>
                            </svg>
                            <span>{{ hospital.bookingRule?.releaseTime }}</span>
                        </div>
                    </div>
                </div>
                <div class="right">
                    <img width="50px" :src="`data:image/jpeg;base64,${hospital.logoData}`" alt="">
                </div>
            </div>
        </el-card>
    </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router';

let props = defineProps(['hospital'])

let $router = useRouter()
const goDetail = () => {
    $router.push(`/hospital?hoscode=${props.hospital.hoscode}`)
}
</script>

<style scoped lang="scss">
// .el-card:hover {
//     font-weight: bold;

//     .desc {
//         font-weight: 500;
//     }
// }
.content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;

    // &:hover {
    //     background-color: red;

    //     .left {
    //         .name {
    //             font-weight: bold;
    //         }
    //     }
    // }

    .left {
        width: 70%;

        .name {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .desc {
            display: flex;
            margin-top: 10px;
            justify-content: space-between;
            color: #7f7f7f;

            .level {
                display: flex;
                align-items: center;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                margin-right: 5px;
            }

            .time {
                display: flex;
                align-items: center;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            span {
                margin-left: 3px;
            }
        }
    }
}
</style>